require(['./config'],()=>{
    require(['jquery'], ()=> {
        class Register{
            constructor(){
                this.$user = $('#numInput')
                this.$pwd = $('#pwdInput')
                this.$pwd1 = $('#pwdInput1')
                this.$email = $('#emailInput')
                this.registerEvent()
            }
            registerEvent(){
               $('#okBtn').on('click',()=>{
                    let name = this.$user.val()
                    let pwd = this.$pwd.val() 
                    let email = this.$email.val()               
                    var userinfo = {name,pwd,email}
                    //验证用户名
                    if(!/^[a-z0-9]{4,10}$/gi.test(name)){
                        $('.ppp').html('用户名请输入4~10位的数字字母组合').css('color','red')
                        return false;
                    }else{
                        $('.ppp').html('用户名输入格式正确').css('color','green') 
                    }
                    //验证邮箱
                    if(!/^\w+([-+.]\w+)*@\w+([-.]\w+)*\.\w+([-.]\w+)*$/.test(email)){
                        $('.ppp1').html('邮箱格式错误').css('color','red')
                        return false;
                    }else{
                        $('.ppp1').html('邮箱格式格式正确').css('color','green') 
                    }
                    //验证密码
                    if(!/^[a-z0-9]{6,}$/gi.test(pwd)){
                        $('.ppp2').html('密码请输入大于6位的数字字母组合').css('color','red')
                        return false;
                    }else{
                        $('.ppp').html('密码输入格式正确').css('color','green') 
                    }
                    //验证重新输入的密码
                    if(pwd != this.$pwd1.val()){
                        $('.ppp3').html('密码错误').css('color','red')
                        return false;
                    }else{
                        $('.ppp3').html('密码正确').css('color','green') 
                    }   
                    // 判断账户是否已注册以及成功后的页面跳转
                    var userList = JSON.parse(localStorage.getItem('userList'))
                    if(userList){
                        var flag = userList.some(item =>{
                            return item.name === userinfo.name && item.pwd === userinfo.pwd
                        })
                        console.log(flag)
                        if(!flag){
                            userList.push(userinfo)
                            localStorage.setItem('userList',JSON.stringify(userList))
                            timer()  
                        }else{
                            console.log(11)
                            $('.ppp4').html('该账户已注册').css('color','orange') 
                            return false
                        }                       
                    }else{
                        var arr = [userinfo]
                        localStorage.setItem('userList',JSON.stringify(arr)) 
                        timer()                       
                    }
                    function timer(){
                        $('.ppp4').html('注册成功，即将跳转登录页').css('color','green')  
                        setTimeout(function () {                                               
                            window.open('/html/login.html','_self') 
                            $('.form span').css('color', rgb(170, 172, 164))
                        }, 2000)
                    }                                                                             
                })
                //密码判断强度
                $('#pwdInput').on('keyup',function(){
                    if(!/^[a-z0-9]{6,}$/gi.test($(this).val())){
                        $(this).next().html('请输入长度大于6位的数字字母组合')
                    }else if(/(^[0-9]+$)|(^[a-z]+$)|(^[A-Z]+$)/g.test($(this).val())){
                        //弱
                        $(this).next().html('密码强度弱').css('color',' pink')
                    }else if(/(^[0-9a-z]+$)|(^[0-9A-Z]+$)|(^[A-z]+$)/g.test($(this).val())){
                        //中
                        $(this).next().html('密码强度中').css('color',' yellow')
                    }else{
                        //强
                        $(this).next().html('密码强度强').css('color',' green')
                    }
                })          
            }
        }
        return new Register()
    })
})
